<template>
  <section class="content">
    <div class="row center-block">
      <div>
        <mywizard ref='userWizard' :steps="steps" :editable='editable' :onNext="nextClicked" :onBack="backClicked" :onSave="toApprove" :onCache="cache">
          <div slot="page1">
            <h4>基础信息</h4>
            <UserInfo ref="userinfo" :enable='editable' v-if='hackShow' :editable='editable' :userInfo="this.userData.userInfo"></UserInfo>
          </div>
          <div slot="page2">
            <h4>补充信息</h4>
            <ExtraInfo ref="extrainfo" :editable='editable' v-bind:extrainfo="this.userData.extrainfo"></ExtraInfo>
          </div>
          <div slot="page3">
            <h4>家庭及社会关系</h4>
            <Social ref="socialInfo" :editable='editable' v-bind:relations="this.userData.relations"></Social>
          </div>
          <div slot="page4">
            <h4>在职培训</h4>
            <Training :editable='editable' ref="training" v-bind:trainings="this.userData.trainings"></Training>
          </div>
          <div slot="page5">
            <h4>在职进修学历(学位)教育</h4>
            <FurtherEdu :editable='editable' ref="furtherEdu" v-bind:educations="this.userData.parttimeEdus"></FurtherEdu>
          </div>
          <div slot="page6">
            <h4>专业技术职务</h4>
            <ProfessionTech :editable='editable' ref="professionTech" v-bind:professionTechs="this.userData.professionTechs"></ProfessionTech>
          </div>
          <div slot="page7">
            <h4>活动(竞赛)</h4>
            <Race :editable='editable' ref="race" v-bind:races="this.userData.races"></Race>
          </div>
          <div slot="page8">
            <h4>参与工程项目建设</h4>
            <Project :editable='editable' ref="project" v-bind:projects="this.userData.projects"></Project>
          </div>
          <div slot="page9">
            <h4>年度考核</h4>
            <KPI :editable='editable' ref="kpi" v-bind:kpis="this.userData.kpis"></KPI>
          </div>
        </mywizard>
        <el-dialog title='提交审核' :visible.sync="approve" :modal="true" width="20%">
          <approveReq ref="approveReq"></approveReq>
          <span slot="footer" class="dialog-footer">
              <el-button type="primary" @click="save">确 定</el-button>
          </span>
        </el-dialog>
      </div>
    </div>
  </section>
</template>
<script>
import Vue from 'vue'
import UserInfo from '../mycomponents/users/UserInfo'
import Training from '../mycomponents/users/Training'
import ExtraInfo from '../mycomponents/users/ExtraInfo'
import Mywizard from '../mycomponents/wizards/MyWizard'
import Social from '../mycomponents/users/Social'
import FurtherEdu from '../mycomponents/users/FurtherEdu'
import ProfessionTech from '../mycomponents/users/ProfessionTech'
import Race from '../mycomponents/users/Race'
import approveReq from '../mycomponents/approve/approveReq'
import Project from '../mycomponents/users/Project'
import KPI from '../mycomponents/users/KPI'
import Utils from "../../common/utils"
import approveUtils from "../../common/approveUtils"
let util = new Utils()
let approveUtil = new approveUtils()
require('moment')
Vue.component(Mywizard.name, Mywizard)
Vue.use(Mywizard)
let DefaultUserData = {
  trainings: [],
  parttimeEdus: [],
  professionTechs: [],
  races: [],
  projects: [],
  kpis: [],
  userInfo: {
    profile: {
      empState: 1,
      workType: 1,
      national: 1,
      policy: 1,
      birthplace: {
        province: 330000,
        city: 330100
      },
      name: '',
      birthday: '',
      ccptime: '',
      joinWorkTime:'',
      sex: 1,
      cert: ''
    },
    employsource: {
      channel: 1,
      depart: [],
      enterTime: ''
    },
    job: {
      postType: 1,
      positionlevel: 1,
      positions: [],
      postCate: 1
    },
    resumes: []
  },
  relations: [],
  extrainfo: {
    extrabaseinfo: {
      fistengagetime: '',
      engageLastTime: '',
      skillworkerdepart: '',
      skillworkerEngageTime: '',
      retiretime: '',
      workage: 0,
      firstsigntime: '',
      lastsigntime: '',
      lefttime: '',
      married: 0,
      domicile: '',
      docloc: '',
      phone: '',
      tel: '',
      qq: '',
      likes: '',
      address: ''
    },
    rewards: []
  }
}

export default {
  name: 'UserImport',
  components: {
    Mywizard,
    UserInfo,
    ExtraInfo,
    Social,
    Training,
    FurtherEdu,
    ProfessionTech,
    Race,
    Project,
    KPI,
    approveReq
  },
  datetime() {
    return new Date()
  },
  data() {
    return {
      approve:false,
      editable: true,
      hackShow: true,
      userData: DefaultUserData,
      steps: [
        {
          label: '基础信息',
          slot: 'page1'
        },
        {
          label: '补充信息',
          slot: 'page2'
        },
        {
          label: '家庭及社会关系',
          slot: 'page3'
        },
        {
          label: '在职培训信息',
          slot: 'page4'
        },
        {
          label: '在职进修学历(学位)教育',
          slot: 'page5'
        },
        {
          label: '专业技术职务',
          slot: 'page6'
        },
        {
          label: '活动(竞赛)信息',
          slot: 'page7'
        },
        {
          label: '工程项目建设情况参与信息',
          slot: 'page8'
        },
        {
          label: '年度考核信息',
          slot: 'page9'
        }
      ]
    }
  },
  created: function() {
    let cachedData = window.localStorage.cachedUserData
    if (cachedData) {
      this.userData = JSON.parse(cachedData)
    }
    else {
      this.init()
    }
    approveUtil.listApprover()
  },
  methods: {
    nextClicked(currentPage) {
      console.log('next clicked', currentPage)
      if (currentPage == 0) {
        var userData = this.$refs.userinfo.getData()
        if(!userData){
          return false
        }
        this.userData.userInfo = userData
      }
      if (currentPage == 1) {
        var extraData = this.$refs.extrainfo.getData()
        if(!extraData){
          return false
        }
        this.userData.extrainfo = extraData
      }
      this.cache()
      console.log('userData:' + JSON.stringify(this.userData))
      return true
    },
    backClicked(currentPage) {
      console.log('back clicked', currentPage)
      return true
    },
    clearInput(vueModel) {
      vueModel = ''
    },
    clearName() {
    },
    toApprove(){
      if(!util.hasRole(4)){
        this.approve = true
      }
      else{
        this.save()
      }
    },
    submit(e) {
      console.log('user data:' + JSON.stringify(this.userData))
    },
    init() {
      this.userData = {
        trainings: [],
        parttimeEdus: [],
        professionTechs: [],
        races: [],
        projects: [],
        kpis: [],
        userInfo: {
          profile: {
            empState: 1,
            workType: 1,
            national: 1,
            policy: 1,
            birthplace: {
              province: 330000,
              city: 330100
            },
            name: '',
            birthday: '',
            ccptime: '',
            joinWorkTime:'',
            sex: 1,
            cert: '',
            image:''
          },
          employsource: {
            channel: 1,
            depart: [],
            enterTime: ''
          },
          job: {
            postType: 1,
            positionlevel: 1,
            positions: [],
            postCate: 1
          },
          resumes: []
        },
        relations: [],
        extrainfo: {
          extrabaseinfo: {
            fistengagetime: '',
            engageLastTime: '',
            skillworkerdepart: '',
            skillworkerEngageTime: '',
            retiretime: '',
            workage: 0,
            firstsigntime: '',
            lastsigntime: '',
            lefttime: '',
            married: 0,
            domicile: '',
            docloc: '',
            phone: '',
            tel: '',
            qq: '',
            likes: '',
            address: ''
          },
          rewards: []
        }
      }
    },
    save() {
      var approveData = {
        approver:'',
        reason:''
      }

      if(!util.hasRole(4)){
        approveData = this.$refs.approveReq.getData()
        if(!approveData){
          return
        }
      }

      var postData = util.buildDbData(approveData,this.userData)
      this.$http.post('/hr/person/add', JSON.stringify(postData)).then(response => {
        console.log("add response" + response);
        if (response.body.result == 1) {
          console.log('new user id ' + JSON.stringify(response.body));
          this.approve=false
          util.showSucInfo(this,"添加用户成功!")
          this.init()
          this.hackShow = false
          window.localStorage.removeItem('cachedUserData')
          this.$nextTick(() => {
            this.hackShow = true
            this.$refs.userWizard.goHome()
          })
        }
        else{
           util.showErrorInfo(this,"添加用户失败,请重试!")
        }
      }, response => {
        console.log('failed:' + response.data)
        util.showErrorInfo(this,"网络异常,请重试!")
      })
      console.log('user data:' + JSON.stringify(this.userData))
    },
    cache() {
      window.localStorage.cachedUserData = JSON.stringify(this.userData)
    }
  }
}
</script>